import { useCssVar, getCssVar, setCssVar, setCssVars } from './useCssVar'

// 定义所有可用的颜色类型
export type ColorType = 
  // 语义化颜色
  | 'primary' | 'success' | 'warning' | 'error' | 'info'
  // 扩展颜色
  | 'secondary' | 'accent' | 'purple' | 'orange' | 'teal' | 'cyan' | 'pink' | 'indigo' | 'lime' | 'amber' | 'deepOrange' | 'lightBlue' | 'lightGreen' | 'brown' | 'blueGrey'
  // 中性色
  | 'white' | 'black' | 'gray50' | 'gray100' | 'gray200' | 'gray300' | 'gray400' | 'gray500' | 'gray600' | 'gray700' | 'gray800' | 'gray900'

/**
 * 主题色管理Hook
 * @returns 主题色相关的工具函数
 */
export function useTheme() {
  // 语义化颜色
  const [primaryColor, setPrimaryColor] = useCssVar('primary-color', '#1677ff')
  const [successColor, setSuccessColor] = useCssVar('success-color', '#52c41a')
  const [warningColor, setWarningColor] = useCssVar('warning-color', '#faad14')
  const [errorColor, setErrorColor] = useCssVar('error-color', '#ff4d4f')
  const [infoColor, setInfoColor] = useCssVar('info-color', '#1890ff')
  
  // 扩展颜色
  const [secondaryColor, setSecondaryColor] = useCssVar('secondary-color', '#6c757d')
  const [accentColor, setAccentColor] = useCssVar('accent-color', '#e91e63')
  const [purpleColor, setPurpleColor] = useCssVar('purple-color', '#9c27b0')
  const [orangeColor, setOrangeColor] = useCssVar('orange-color', '#ff9800')
  const [tealColor, setTealColor] = useCssVar('teal-color', '#009688')
  const [cyanColor, setCyanColor] = useCssVar('cyan-color', '#00bcd4')
  const [pinkColor, setPinkColor] = useCssVar('pink-color', '#e91e63')
  const [indigoColor, setIndigoColor] = useCssVar('indigo-color', '#3f51b5')
  const [limeColor, setLimeColor] = useCssVar('lime-color', '#cddc39')
  const [amberColor, setAmberColor] = useCssVar('amber-color', '#ffc107')
  const [deepOrangeColor, setDeepOrangeColor] = useCssVar('deep-orange-color', '#ff5722')
  const [lightBlueColor, setLightBlueColor] = useCssVar('light-blue-color', '#03a9f4')
  const [lightGreenColor, setLightGreenColor] = useCssVar('light-green-color', '#8bc34a')
  const [brownColor, setBrownColor] = useCssVar('brown-color', '#795548')
  const [blueGreyColor, setBlueGreyColor] = useCssVar('blue-grey-color', '#607d8b')
  
  // 中性色
  const [whiteColor, setWhiteColor] = useCssVar('white-color', '#ffffff')
  const [blackColor, setBlackColor] = useCssVar('black-color', '#000000')
  const [gray50Color, setGray50Color] = useCssVar('gray-50', '#f9fafb')
  const [gray100Color, setGray100Color] = useCssVar('gray-100', '#f3f4f6')
  const [gray200Color, setGray200Color] = useCssVar('gray-200', '#e5e7eb')
  const [gray300Color, setGray300Color] = useCssVar('gray-300', '#d1d5db')
  const [gray400Color, setGray400Color] = useCssVar('gray-400', '#9ca3af')
  const [gray500Color, setGray500Color] = useCssVar('gray-500', '#6b7280')
  const [gray600Color, setGray600Color] = useCssVar('gray-600', '#4b5563')
  const [gray700Color, setGray700Color] = useCssVar('gray-700', '#374151')
  const [gray800Color, setGray800Color] = useCssVar('gray-800', '#1f2937')
  const [gray900Color, setGray900Color] = useCssVar('gray-900', '#111827')

  return {
    // 当前颜色值
    colors: {
      // 语义化颜色
      primary: primaryColor,
      success: successColor,
      warning: warningColor,
      error: errorColor,
      info: infoColor,
      
      // 扩展颜色
      secondary: secondaryColor,
      accent: accentColor,
      purple: purpleColor,
      orange: orangeColor,
      teal: tealColor,
      cyan: cyanColor,
      pink: pinkColor,
      indigo: indigoColor,
      lime: limeColor,
      amber: amberColor,
      deepOrange: deepOrangeColor,
      lightBlue: lightBlueColor,
      lightGreen: lightGreenColor,
      brown: brownColor,
      blueGrey: blueGreyColor,
      
      // 中性色
      white: whiteColor,
      black: blackColor,
      gray50: gray50Color,
      gray100: gray100Color,
      gray200: gray200Color,
      gray300: gray300Color,
      gray400: gray400Color,
      gray500: gray500Color,
      gray600: gray600Color,
      gray700: gray700Color,
      gray800: gray800Color,
      gray900: gray900Color,
    },
    
    // 设置函数
    setColor: {
      // 语义化颜色
      primary: setPrimaryColor,
      success: setSuccessColor,
      warning: setWarningColor,
      error: setErrorColor,
      info: setInfoColor,
      
      // 扩展颜色
      secondary: setSecondaryColor,
      accent: setAccentColor,
      purple: setPurpleColor,
      orange: setOrangeColor,
      teal: setTealColor,
      cyan: setCyanColor,
      pink: setPinkColor,
      indigo: setIndigoColor,
      lime: setLimeColor,
      amber: setAmberColor,
      deepOrange: setDeepOrangeColor,
      lightBlue: setLightBlueColor,
      lightGreen: setLightGreenColor,
      brown: setBrownColor,
      blueGrey: setBlueGreyColor,
      
      // 中性色
      white: setWhiteColor,
      black: setBlackColor,
      gray50: setGray50Color,
      gray100: setGray100Color,
      gray200: setGray200Color,
      gray300: setGray300Color,
      gray400: setGray400Color,
      gray500: setGray500Color,
      gray600: setGray600Color,
      gray700: setGray700Color,
      gray800: setGray800Color,
      gray900: setGray900Color,
    },
    
    // 便捷方法
    setTheme: setPrimaryColor,
    
    // 获取所有颜色
    getAllColors: () => ({
      // 语义化颜色
      primary: primaryColor,
      success: successColor,
      warning: warningColor,
      error: errorColor,
      info: infoColor,
      
      // 扩展颜色
      secondary: secondaryColor,
      accent: accentColor,
      purple: purpleColor,
      orange: orangeColor,
      teal: tealColor,
      cyan: cyanColor,
      pink: pinkColor,
      indigo: indigoColor,
      lime: limeColor,
      amber: amberColor,
      deepOrange: deepOrangeColor,
      lightBlue: lightBlueColor,
      lightGreen: lightGreenColor,
      brown: brownColor,
      blueGrey: blueGreyColor,
      
      // 中性色
      white: whiteColor,
      black: blackColor,
      gray50: gray50Color,
      gray100: gray100Color,
      gray200: gray200Color,
      gray300: gray300Color,
      gray400: gray400Color,
      gray500: gray500Color,
      gray600: gray600Color,
      gray700: gray700Color,
      gray800: gray800Color,
      gray900: gray900Color,
    }),
    
    // 批量设置颜色
    setAllColors: (colors: Partial<Record<ColorType, string>>) => {
      const colorMap: Record<string, string> = {
        primary: 'primary-color',
        success: 'success-color',
        warning: 'warning-color',
        error: 'error-color',
        info: 'info-color',
        secondary: 'secondary-color',
        accent: 'accent-color',
        purple: 'purple-color',
        orange: 'orange-color',
        teal: 'teal-color',
        cyan: 'cyan-color',
        pink: 'pink-color',
        indigo: 'indigo-color',
        lime: 'lime-color',
        amber: 'amber-color',
        deepOrange: 'deep-orange-color',
        lightBlue: 'light-blue-color',
        lightGreen: 'light-green-color',
        brown: 'brown-color',
        blueGrey: 'blue-grey-color',
        white: 'white-color',
        black: 'black-color',
        gray50: 'gray-50',
        gray100: 'gray-100',
        gray200: 'gray-200',
        gray300: 'gray-300',
        gray400: 'gray-400',
        gray500: 'gray-500',
        gray600: 'gray-600',
        gray700: 'gray-700',
        gray800: 'gray-800',
        gray900: 'gray-900',
      }
      
      const vars: Record<string, string> = {}
      Object.entries(colors).forEach(([key, value]) => {
        if (value && colorMap[key as ColorType]) {
          vars[colorMap[key as ColorType]] = value
        }
      })
      setCssVars(vars)
    }
  }
}

/**
 * 获取颜色值（非Hook版本）
 * @param colorName 颜色名称
 * @returns 颜色值
 */
export function getThemeColor(colorName: ColorType): string {
  const colorMap: Record<ColorType, string> = {
    primary: 'primary-color',
    success: 'success-color',
    warning: 'warning-color',
    error: 'error-color',
    info: 'info-color',
    secondary: 'secondary-color',
    accent: 'accent-color',
    purple: 'purple-color',
    orange: 'orange-color',
    teal: 'teal-color',
    cyan: 'cyan-color',
    pink: 'pink-color',
    indigo: 'indigo-color',
    lime: 'lime-color',
    amber: 'amber-color',
    deepOrange: 'deep-orange-color',
    lightBlue: 'light-blue-color',
    lightGreen: 'light-green-color',
    brown: 'brown-color',
    blueGrey: 'blue-grey-color',
    white: 'white-color',
    black: 'black-color',
    gray50: 'gray-50',
    gray100: 'gray-100',
    gray200: 'gray-200',
    gray300: 'gray-300',
    gray400: 'gray-400',
    gray500: 'gray-500',
    gray600: 'gray-600',
    gray700: 'gray-700',
    gray800: 'gray-800',
    gray900: 'gray-900',
  }
  return getCssVar(colorMap[colorName])
}

/**
 * 设置颜色值（非Hook版本）
 * @param colorName 颜色名称
 * @param value 颜色值
 */
export function setThemeColor(colorName: ColorType, value: string): void {
  const colorMap: Record<ColorType, string> = {
    primary: 'primary-color',
    success: 'success-color',
    warning: 'warning-color',
    error: 'error-color',
    info: 'info-color',
    secondary: 'secondary-color',
    accent: 'accent-color',
    purple: 'purple-color',
    orange: 'orange-color',
    teal: 'teal-color',
    cyan: 'cyan-color',
    pink: 'pink-color',
    indigo: 'indigo-color',
    lime: 'lime-color',
    amber: 'amber-color',
    deepOrange: 'deep-orange-color',
    lightBlue: 'light-blue-color',
    lightGreen: 'light-green-color',
    brown: 'brown-color',
    blueGrey: 'blue-grey-color',
    white: 'white-color',
    black: 'black-color',
    gray50: 'gray-50',
    gray100: 'gray-100',
    gray200: 'gray-200',
    gray300: 'gray-300',
    gray400: 'gray-400',
    gray500: 'gray-500',
    gray600: 'gray-600',
    gray700: 'gray-700',
    gray800: 'gray-800',
    gray900: 'gray-900',
  }
  setCssVar(colorMap[colorName], value)
} 